<template>
<div>
  <ul>
    <li v-for="(value,index) in arr" :key="index">
      {{value}}

    </li>

  </ul>
  <button @click="revBtn">数组翻转</button>
<!--  遇到push pop shift unshift splice sort reverse这些数组变更方法页面会同步更新-->
  <button @click="jBtn">截取前三个</button>
  <button @click="updateBtn">更新第一个元素</button>
</div>
</template>

<script>
export default {

  data() {
    return {

      arr:[5,3,9,2,1]
    }
  }
  ,methods:{
    revBtn(){
      this.arr.reverse()
    },
    jBtn(){
      var re = this. arr.slice(0,3);
      this.arr=re
    },
    updateBtn(){

      // 使用this.$set()更新数据页面才会检测到并刷新
      this.$set(this.arr,0,12314)
      // 1目标对象 2坐标 3值
    }
  }
};
</script>

<style scoped>


</style>